import React, { PropTypes } from 'react'
import _ from 'lodash'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { actions } from '../modules/choujiang'
import WinItem from './winItem.jsx'
import Button from './button.jsx'

@connect(
  state => ({ ...state.layoutState, params: state.params }),
  dispatch => ({ ...bindActionCreators({...actions}, dispatch) })
)
class ChouJiang extends React.Component {
  constructor(props) {
    super(props)
    let date = new Date(); //日期对象
    this.desc = '©Copyright 2013-'+date.getFullYear()+' 版权所有 金色百年婚礼服务集团有限公司'
  }

  render() {
    const {
      lg,
      changeData,
      result,
      isRun,
      isOver,
      config,
      params,
      } = this.props

    let bgUrl = params.mode ==='development' ? "/static/images/bg.jpg" : 'file/bg.jpg'
    let logoUrl = params.mode ==='development' ? "/static/images/logo.jpg" : 'file/logo.jpg'
    let seq = 0
    let btnValue = isRun ? '停' : '开始'
    return (
      <div className="winners-system">
        <img className="bg-img" src={bgUrl} alt=""></img>

        <div className="theme-title">
          <div className="logo-box">
            <span className="title-1">{config.slogan1}&nbsp;</span>
            <img  className="logo-img" src={logoUrl} alt=""></img>
            <span className="title-1">&nbsp;{config.slogan2}</span>
          </div>
          <span className="title-2">{config.slogan3}</span>
        </div>

        <div className="center-box">
          <input className="winners-text" type="text" size="30" placeholder="中奖号码" value={changeData} readOnly></input>
          <div className="ctl-box">
            <Button value={btnValue} disabled={isOver} type={0} onClick={lg} />
            <Button value='无效' disabled={!(!isRun&&(result.length > 0))} type={1} onClick={lg} />
          </div>
        </div>

        <div className="winners-list">
          {
            _.map(config.winConfig, (v, k) => {
              let arr = _.slice(result, seq, seq+v.num)
              seq += v.num
              return (
                <WinItem key={k} title={v.name} datas={arr} />
              )
            })
          }
        </div>

        <div className="bottom-box">
          <span>{this.desc}</span>
        </div>
      </div>
    )
  }
}

export default ChouJiang
